﻿
@{
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>云瑞家庭农场</title>
    <link rel="shortcut icon" href="~/Content/assets/i/miemie_favicon.ico" />
    <link href="~/Content/layui/css/layui.css" rel="stylesheet" />
    <script src="~/Content/layui/layui.js"></script>
    <script type="text/javascript" src="/Scripts/jquery-3.3.1.js"></script>
    <script type="text/javascript">
        layui.use(['form', 'layedit', 'laydate'], function () {
            var form = layui.form
                , layer = layui.layer
                , layedit = layui.layedit
                , laydate = layui.laydate;

            //日期
            laydate.render({
                elem: '#date'
            });
            laydate.render({
                elem: '#date1'
            });

            //创建一个编辑器
            var editIndex = layedit.build('LAY_demo_editor');
            layui.use('table', function () {
                var table = layui.table;
                table.render({
                    elem: '#test'//放入的控件，必填
                    ,limit:5
                    , url: '/YunRuiFarmAPI/UserAgriculturalOrderGetMessageAPI'//输入链接
                    , where: { Token: cookie("token") }
                    , page: {
                        layout: ['count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
                        ,curr: 1 //设定初始在第 5 页
                        , groups: 1 //只显示 1 个连续页码
                        , first: false //不显示首页
                        , last: false //不显示尾页
                    }
                    , id: test
                    , width: 930
                    , cols: [[
                        { field: 'OrderId', width: 350, title: '订单号' }
                        , { field: 'Agricultural', width: 150, title: '预订种类' }
                        , {
                            field: 'Number', width: 100, title: '预订数量'
                            , templet: function (d) {
                                //控制操作列中显示内容
                                if (d.Style == 1) {
                                    return d.Number+'只'
                                }
                                else
                                    return d.Number +'斤'
                            }}
                        
                        , { field: 'Result', width: 100, title: '预约情况' }
                        , {
                            field: 'Id', align: 'center', title: '操作'
                            , templet: function (d) {
                                //控制操作列中显示内容
                                if (d.Result == "预订中") {
                                    return '<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a><a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="unsubscribe">退订</a>'
                                }
                                else if (d.Result == "预订成功")
                                    return '<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="check">预订信息查看</a>'
                                else 
                                    return '<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>'
                            }}
                    ]]
                    
                });

                //监听工具条
                table.on('tool(demo)', function (obj) {
                    var data = obj.data;
                    var AgriculturalNumbur = data.Number + '斤';
                    if (data.Style == 1)
                        AgriculturalNumbur = data.Number + '只';
                    var Token = cookie("token");
                    if (obj.event === 'detail') {  //查看
                        layer.open({
                            type: 1
                            , title: false //不显示标题栏
                            , closeBtn: false
                            , area: '500px;'
                            , shade: 0.8
                            , id: 'LAY_layuipro' //设定一个id，防止重复弹出
                            , btn: ['关闭']
                            , btnAlign: 'c'
                            , moveType: 1 //拖拽模式，0或者
                            , content: '<div style="padding: 50px; line-height: 22px; background-color: #393D49; color: #fff; font-weight: 300;">订单号：' + data.OrderId + '<br>联系人：' + data.Name + '<br>联系方式：' + data.Contacts + '<br>领养种类：' + data.Agricultural + '<br>领养数量：' + AgriculturalNumbur + '<br>当前状态：' + data.Result + '</div>'   
                        });
                    } else if (obj.event === 'unsubscribe') {   //退订
                        layer.confirm('是否需要取消该订单？', function (index) {
                            //obj.del();
                            $.ajax({    
                                url: "/YunRuiFarmAPI/AgriculturalOrderUnsubscribeAPI", //请求的URL
                                cache: true, //不从缓存中取数据
                                data: {
                                    "OrderId": data.OrderId,
                                    "Token": Token
                                }, //发送的参数
                                type: 'post', //请求类型
                                dataType: 'json', //返回类型是JSON
                                timeout: 20000, //超时
                            })
                                .done(function (result) {
                                    if (result.IsSuccess) {
                                        layer.msg(result.Message);
                                        location.reload();
                                    }
                                    else
                                        layer.msg(result.Message);
                                });
                            layer.close(index);
                        });
                    } else if (obj.event === 'check') {   //查看信息
                        window.location.href = "/YunRuiFarm/GoatOrderDetail?OrderId=" + data.OrderId;
                    }
                });
            });
            $(document).ready(function () {
                var _token = cookie("token");
                var Kind = getQueryString("Kind");
                if (Kind > 2 || Kind<1)
                    Kind = 1;
                $.ajax({
                    url: "/YunRuiFarmAPI/GoatAppointmentGetLoginMessageAPI", //请求的URL
                    cache: true, //不从缓存中取数据
                    data: {
                        "Token": _token,
                    }, //发送的参数
                    type: 'post', //请求类型
                    dataType: 'json', //返回类型是JSON
                    timeout: 20000, //超时
                })
                    .done(function (result) {
                        if (result.IsSuccess)
                        {
                            $("#Name").html("<img src= \"/Content/image/小埋1.jpg\" class=\"layui-nav-img\"/>" + result.Name);

                            $("#Kind").val(Kind);
                            var count = $("#Kind option").length;//select下拉框的option条数
                            for (var i = 0; i < count; i++) {
                                if ($("#Kind").get(0).options[i].text == Kind) {
                                    $("#Kind").get(0).options[i].selected = true;
                                    break;
                                }
                            }
                            $("#name").val(result.Name);
                            $("#contacts").val(result.Contacts);
                        }
                        else {
                            $("#Name").html("<img src= \"/Content/image/小埋1.jpg\" class=\"layui-nav-img\"/>" + "请先登录")
                            $("#UsecCenter").html("<dd><a href=\"/YunRuiFarm/Login\">登录</a></dd>");
                            $("#Operation").html("");
                        }
                    });
                
                
                //清除cookie
                $("#Cancellation").click(function () {
                    layer.msg("清除token");
                    delcookie("token", "", { expires: -1 });
                    window.location.href = "/YunRuiFarm/Login";
                });
                //点击左侧导航预约进行cookie判断
                $("#appointment1").click(function () {
                    if (_token == null) {
                        layer.msg("请先登录");
                        setTimeout(function () {
                            window.location.href = '/YunRuiFarm/Login'
                        }, 3000);
                    }
                    else
                        window.location.href = '/YunRuiFarm/GoatAppointment?Kind=1'
                });
                //点击左侧导航预约进行cookie判断
                $("#appointment2").click(function () {
                    if (_token == null) {
                        layer.msg("请先登录");
                        setTimeout(function () {
                            window.location.href = '/YunRuiFarm/Login'
                        }, 3000);
                    }
                    else
                        window.location.href = '/YunRuiFarm/GoatAppointment?Kind=2'
                });
            });
            //获取URL中羊种类
            function getQueryString(name) {
                var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
                var r = window.location.search.substr(1).match(reg);
                if (r != null) {
                    return unescape(r[2]);
                }
                return 1;
            }
            function cookie(key, value, options) {
                if (typeof value === "undefined") {
                    var cookies = document.cookie.split("; ");
                    for (var i = 0, len = cookies.length; i < len; i++) {
                        var cookie = cookies[i].split("=");
                        if (decodeURIComponent(cookie[0]) === key) {
                            return decodeURIComponent(cookie[1]);
                        }
                    }
                    return null;
                }
            }

            //删除cookie
            function delcookie(key, value, options) {
                options = options || {};
                var cookie = encodeURIComponent(key) + "=" + value;
                if ((typeof options.expires) !== "undefined") {
                    if (typeof options.expires === "number") {
                        var days = options.expires,
                            t = options.expires = new Date();
                        t.setDate(t.getDate() + days);
                    }
                    cookie += ";expires=" + options.expires.toUTCString();
                }
                if (typeof options.path !== "undefined")
                    cookie += ";path=" + options.path;
                if (typeof options.domain !== "undefined")
                    cookie += ";domain=" + options.domain;
                if (options.secure)
                    cookie += ";secure";
                document.cookie = cookie;
            }
        });
    </script>
    <script>
        layui.use('element', function () {
            var element = layui.element;
        });
        var url = document.location.toString();
        var arrUrl = url.split("=");
        var para = arrUrl[1];


    </script>
    <style>
        body {
            font-size: 18px;
        }

        #divtitle {
            margin: 0 auto;
            margin-top: 0px;
            margin-bottom: 0px;
        }


        #content-right {
            width: 100%;
            height: 100%;
            float: right
        }

        #content-right-top {
            margin-top: 2%;
            margin-right: 2%;
            margin-left: 2%;
            height: 20%;
            width: 96%;
            float: left
        }

        #content-right-button {
            margin-right: 2%;
            margin-left: 2%;
            margin-top: 1%;
            height: 64%;
            width: 96%;
            float: left;
            background-color: white;
        }
        #content-right-button-table {
            margin-left: 10%;
            margin-top: 1%;
            height: 64%;
            width: 96%;
            float: left;
        }
        

        img {
            width: 100%;
            height: 100%;
        }
    </style>
</head>
<body class="layui-layout-body">
    <div class="layui-layout layui-layout-admin">
        <div class="layui-header" style="width:auto">
            <div class="layui-logo" style=" background-image: url('../../Content/image/logo.jpg');background-size:100% 100%;"></div>
            <!-- 头部区域（可配合layui已有的水平导航） -->
            <ul class="layui-nav layui-layout-left" style="font-size: 20px;">
                <li class="layui-nav-item"><a href="/YunRuiFarm/Index">首页</a></li>
                <li class="layui-nav-item"><a href="/YunRuiFarm/Adopt">羊领养预约</a></li>
                <li class="layui-nav-item"><a href="/YunRuiFarm/Agricultural">农副产品预约</a></li>
                <li class="layui-nav-item"><a href="/YunRuiFarm/Restaurant">餐饮预约</a></li>
            </ul>
            <ul class="layui-nav layui-layout-right">
                <li class="layui-nav-item">
                    <a href="javascript:;" id="Name">
                        <img src="/Content/image/小埋1.jpg" class="layui-nav-img" />请先登录
                    </a>
                    <dl class="layui-nav-child" id="UsecCenter">
                        <dd><a href="/YunRuiFarm/UserInfo">基本资料</a></dd>
                        <dd><a href="/YunRuiFarm/UserAgriculturalOrder">我的订单</a></dd>
                        <dd><a href="/YunRuiFarm/UserFeedback">反馈信息</a></dd>
                    </dl>
                </li>
                <li class="layui-nav-item" id="Operation">
                    <a href="javascript:;">账户操作</a>
                    <dl class="layui-nav-child">
                        <dd><a href="/YunRuiFarm/AdministratorsGoatOrder">切换到管理员</a></dd>
                        <dd><a href="javascript:;" id="Cancellation">注销</a></dd>
                    </dl>
                </li>
            </ul>
        </div>
        <div class="layui-side layui-bg-black">
            <div class="layui-side-scroll">
                <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
                <ul class="layui-nav layui-nav-tree" lay-filter="test">
                    <li class="layui-nav-item layui-nav-itemed">
                        <a class="" href="javascript:;">个人中心</a>
                        <dl class="layui-nav-child">
                            <dd><a href="/YunRuiFarm/UserInfo">个人信息</a></dd>
                            <dd><a href="/YunRuiFarm/UserGoatOrder">羊领养订单</a></dd>
                            <dd><a href="/YunRuiFarm/UserRestaurantOrder">餐饮订单</a></dd>
                            <dd><a href="/YunRuiFarm/UserAgriculturalOrder">农副产品订单</a></dd>
                            <dd><a href="/YunRuiFarm/UserFeedback">反馈</a></dd>
                        </dl>
                    </li>
                </ul>
            </div>
        </div>
        <div class="layui-body" style="background-color:#c0c0c0;height:100%;">
            <!-- 内容主体区域 -->
            <div id="content-right">
                <div id="content-right-top">
                    <img src="~/Content/image/grass.jpg" style="height:100%;" />
                </div>
                <div id="content-right-button">
                    <div id="content-right-button-table">
                        <table class="layui-hide" id="test" lay-filter="demo" lay-data="{id: 'test'}"></table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/html" id="barDemo">
        <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">退订</a>
    </script>
</body>
</html>
